<template>
    <view class="p-20">
        <z-paging ref="paging" v-model="dataList" use-page-scroll @query="queryList">
            <template #refresher="{refresherStatus}">
                <custom-refresher :status="refresherStatus" />
            </template>
            <template #loadingMoreNoMore>
                <custom-nomore />
            </template>

            <view class="" v-for="(item,index) in dataList" :key="index">
                <view class="bg-white p-30 flex col-center row-between m-b-20 box_shadow br12">
                    <view class="">
                        <view class="bold x">
                            商品编号:{{item.productNo}}
                        </view>
                        <view class="m-t-20 xs">
                            销售状态：<uni-tag v-if="item.salesStatus == 0" type="warning" text="待售商品" size="mini" />
                            <uni-tag v-if="item.salesStatus == 1" type="success" text="已售商品" size="mini" />
                        </view>
                    </view>
                    <view class="">
                        <u-tag text="编辑" type="primary" @click="openPopup(item)"></u-tag>
                    </view>
                </view>
            </view>
            <u-popup v-model="showPopup" mode="right" length="80%">
                <view class="p-20">
                    <uni-forms :model="goodsInfo">
                        <uni-forms-item label="商品编号">
                            <uni-easyinput disabled v-model="goodsInfo.productNo " border="none" />
                        </uni-forms-item>
                        <uni-forms-item label="鉴定名称">
                            <uni-easyinput v-model="goodsInfo.identifyName" border="none" placeholder="请输入鉴定名称" />
                        </uni-forms-item>
                        <uni-forms-item label="鉴定状态">
                            <uni-data-select v-model="goodsInfo.identifyStatus"
                                :localdata="identifyStatusList"></uni-data-select>
                        </uni-forms-item>
                        <uni-forms-item label="鉴定机构">
                            <uni-data-select v-model="goodsInfo.identifyInstitution"
                                :localdata="identifyInstitutionList"></uni-data-select>
                        </uni-forms-item>
                        <uni-forms-item label="鉴定价格">
                            <uni-easyinput v-model="goodsInfo.identifyPrice" type="number" border="none"
                                placeholder="请输入鉴定价格" />
                        </uni-forms-item>

                        <uni-forms-item label="鉴定日期">
                            <uni-easyinput v-model="goodsInfo.identifyDate" @focus="showCalendar = true" border="none"
                                placeholder="请选择日期" />
                        </uni-forms-item>
                    </uni-forms>
                    <view class="flex row-around">
                        <u-button @click="showPopup = false">取消</u-button>
                        <u-button type="primary" @click="editData(goodsInfo)">保存</u-button>
                    </view>
                </view>
            </u-popup>
            <u-calendar v-model="showCalendar" mode="date" @change="selectDate"></u-calendar>
        </z-paging>
    </view>
</template>

<script setup>
    import {
        apiUpdateIdentifyInfo,
        apiGetIdentifyList,
    } from '@/api/index.js'
    import {
        ref
    } from 'vue'
    import {
        onLoad
    } from '@dcloudio/uni-app'
    import {
        onPageScroll,
        onReachBottom
    } from '@dcloudio/uni-app';
    import useZPaging from "@/uni_modules/z-paging/components/z-paging/js/hooks/useZPaging.js";

    const dataList = ref([])
    const brandList = ref([])
    const paging = ref(null)
    const showPopup = ref(false)
    const goodsInfo = ref({})
    const showCalendar = ref(false)
    const identifyStatusList = [{
        text: '待鉴定',
        value: '0'
    }, {
        text: '已鉴定',
        value: '1'
    }, {
        text: '通过鉴定',
        value: '2'
    }, {
        text: '未通过鉴定',
        value: '3'
    }]
    const identifyInstitutionList = [{
        text: '中检',
        value: '0'
    }, {
        text: '中溯',
        value: '1'
    }, {
        text: '中恒信',
        value: '2'
    }, {
        text: '广检   ',
        value: '3'
    }]

    const openPopup = (item) => {
        showPopup.value = true
        goodsInfo.value = item
    }

    const queryList = (pageNo, pageSize) => {
        const params = {
            current: pageNo,
            pageSize: pageSize,
        }
        apiGetIdentifyList(params).then(res => {
            paging.value.complete(res.data.records);
        }).catch(res => {
            paging.value.complete(false);
        })
    }

    const editData = async (params) => {
        try {
            let res = await apiUpdateIdentifyInfo(params)
            if (res.code == 200) {
                uni.$u.toast('编辑成功')
                setTimeout(() => {
                    showPopup.value = false
                }, 1000)
            } else {
                uni.$u.toast('编辑失败')
            }
        } catch (err) {

        }
    }
    useZPaging(paging)
    const selectDate = (e) => {
        goodsInfo.value.salesDate = e.result
        showCalendar.value = false
    }
</script>